<?php $this->headTitle($this->__('Manage Users') . ' » ', Zend_View_Helper_Placeholder_Container_Abstract::PREPEND);?>

<script type="text/javascript" src="http://www.datatables.net/release-datatables/media/js/jquery.dataTables.js"></script>

<style type="text/css">
    .DataTables_sort_icon {
        float: right;
    }
    .fg-toolbar {
        border:0;
        padding: 3px;
    }
    .dataTables_filter {
        width: 200px;
        float: right;
    }
    .dataTables_length, #example_info, #example_paginate {
        width: 50%;
        float: left;
    }
    #example_paginate {
        text-align: right;
    }
    #example_previous, #example_next {
        display: inline-block;
    }
</style>

<table id="example">
    <thead>
        <tr>
            <?php foreach ($this->columns as $column):?>
                <th><?php echo $column?></th>
            <?php endforeach;?>
            <th><?php echo $this->__('Edit')?></th>
            <th><?php echo $this->__('Delete')?></th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td colspan="5" class="dataTables_empty">Loading data from server</td>
        </tr>
    </tbody>
</table>

<script type="text/javascript">
$(document).ready(function() {
	$('#example').dataTable( {
	    "bJQueryUI": true,
		"bProcessing": true,
		"bServerSide": true,
		"sAjaxSource": "<?php echo $this->url()?>",
		"aoColumns": [
            <?php foreach ($this->columns as $i => $column):?>
				{ "mDataProp": "<?php echo $column?>" }<?php //if (count($this->columns) != $i+1):?>,<?php //endif?>
			<?php endforeach;?>
			{ "mDataProp": "editUrl" },
			{ "mDataProp": "deleteUrl"}
					]
	} );
    $('#example_wrapper').addClass('ui-widget-content ui-corner-all');
} );
</script>